<template>
  <div class="a">
    <el-form :model="users" :rules="rules" ref="users">
      <el-form-item label="用户名" prop="name">
        <el-input v-model="users.name" ></el-input>
      </el-form-item>
      <el-form-item label="手机号" prop="phone">
        <el-input  v-model.number="users.phone"></el-input>
      </el-form-item>
      <el-form-item label="邮箱" prop="mail">
        <el-input  v-model="users.mail"></el-input>
      </el-form-item>
      <el-form-item label="身份证号" prop="idnumber">
        <el-input v-model="users.idnumber" @change="update(users)"></el-input>
      </el-form-item>

      <el-form-item label="性别" prop="sex">
        <el-radio-group v-model="users.sex">
          <el-radio label="男"></el-radio>
          <el-radio label="女"></el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="密码" prop="password">
        <el-input v-model="users.password" ></el-input>
      </el-form-item>
      <el-form-item>
        <el-button @click="this.$router.push('/')">点击返回</el-button>
        <el-button icon="el-icon-position" type="primary" @click="submitForm('users')">确定注册</el-button>
        <el-button icon="el-icon-refresh" @click="resetForm('users')">重置所有</el-button>
      </el-form-item>
    </el-form>
  </div>

</template>

<script>
import moment from "moment";
import da from "element-ui/src/locale/lang/da";

export default {
  name: "Register",
  created() {

  },
  data(){
    return{
      users:{
        id:0,name:"",sex:"",phone:"",idnumber:"",password: "",state:0,mail:""
      },
      rules:{
        name:[
          {required:true,message:'请输入您的姓名',trigger:'blur'},
          { min: 2, max: 7, message: '长度在 2 到  7 个字', trigger: 'blur' }
        ],
        phone:[
          {required:true,message:'请输入您的手机号',trigger:'blur'},
          { type: 'number', message: '手机号应该是数字'}
        ],
        idnumber:[
          {required:true,message:'请输入您的身份证',trigger:'blur'},
          { min: 18, max: 18, message: '长度应该是18位', trigger: 'blur' }
        ],
        sex: [
          { required: true, message: '请选择性别', trigger: 'change' }
        ],  username:[
          {required:true,message:'请输入您的用户名',trigger:'blur'},
          { min: 3, max: 7, message: '长度在 3 到  7 个字', trigger: 'blur' }
        ],password:[
          {required:true,message:'请输入您的密码',trigger:'blur'},
          { min: 3, max: 12, message: '长度在 3 到  12 个字', trigger: 'blur' }
        ],mail:[
          {required:true,message:'请输入您的邮箱',trigger:'blur'},
        ]
      }
    }
  },
  methods:{
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }, update(users){
      let b=users.idnumber.substr(16,1)
      let sex=b%2
      if (sex==1){
        this.users.sex='男'
      }else {
        this.users.sex='女'
      }
    },submitForm(users){
      this.$http.post("/frontservice/fuser/add",this.users).then(data=>{
       if (data.data!=null){
         alert("注册成功")
         this.$router.push("/")
       }
      })
    }
  }
}
</script>

<style scoped>
.a{
  width: 30%;
  margin-left: 650px;
}
</style>
